<template>
  <div>
    <Breadcrumb :style="{margin: '24px 0'}">
        <BreadcrumbItem>首页</BreadcrumbItem>
        <BreadcrumbItem>产品管理</BreadcrumbItem>
        <BreadcrumbItem>产品品牌列表</BreadcrumbItem>
    </Breadcrumb>
    <Content :style="{padding: '24px', minHeight: '580px', background: '#fff'}">
        <div style="height:50px;">
          <div style="float:left">
            <Button type="primary" @click="addArticle()">添加品牌</Button>
          </div>
          <div style="float:right;">
            <Button  icon="ios-search" style="float:right;margin-left:5px;" @click="getpage()">Search</Button>
            <Input v-model="search" style="float:right;width:250px;"></Input>
          </div>
        </div>

        <div>
          <Table border ref="selection" :columns="columns7" :data="data"></Table><br>
          <span style="align:center" >
            <span v-if = "$route.query.page == undefined ">
              <Page :total="page" :page-size="10" :current="1"  @on-change="getpage" ></Page>
            </span>
            <span v-else>
              <Page :total="page" :page-size="10" :current="parseInt($route.query.page)"  @on-change="getpage" ></Page>
            </span>
          </span>
        </div>
        <!-- 弹出框代码start -->
        <Modal
            v-model="modal1"
            @on-ok="ok"
            @on-cancel="cancel">
            <p>是否删除这个品牌？</p>
        </Modal>
        <!-- 弹出框代码end -->

        <!-- 弹出框代码start -->
        <Modal v-model="addbrand" @on-ok="ok_addbrand" @on-cancel="cancel_addbrand" title="添加商品品牌">
            <div class="modeldiv">
              <p class="catename"><b>品牌名称</b></p>
              <Input  placeholder="请输入品牌名称" style="width: 300px" v-model="brand_name"></Input><br><br>
              <p class="catename"><b>所属分类</b></p>
              <Select v-model="cate_id" style="width:300px">
                  <Option v-for="item in shopcatelist" :value="item.id" :key="item.id" >{{ item.cate_name }}</Option>
              </Select><br><br><br>
            </div>
        </Modal>
        <!-- 弹出框代码end -->
    </Content>
  </div>
</template>
<style scoped>
.info {
  border-radius: 10px;
  line-height: 20px;
  padding: 10px;
  margin: 10px;
  background-color: #ffffff;
}
</style>
<script>
import productbrand from '@/assets/js/views/product/productbrand';

export default {
  ...productbrand,
};
</script>

